<?php include $this->templateDir . 'common/header.php'; ?>
<body>
<style type="text/css">
    *{font-family: "微软雅黑";  }
    a{text-decoration:none;}
    table {border-left:1px solid #F0F9FC; border-top:1px solid #F0F9FC;}
    td,th{border-right:1px solid #F0F9FC; border-bottom:1px solid #F0F9FC; padding:8px;  }
    /* 分页样式 */
    .grace-pager{float:left;}
    .grace-pager a{display:block; background:#F5F5F5; padding:0px 10px; height:30px; line-height:30px; float:left; margin:3px; border-radius:2px;}
    .grace-pager a:hover{background:#2F4056; text-decoration:none; color:#FFF;}
    .grace-pager .grace-current{background:#5FB878 !important; color:#FFF !important;}
</style>
<div class="yadmin-body animated fadeIn">
    <div class="layui-card">
        <div class="layui-card-header">
            <button type="button" class="layui-btn  layui-btn-sm" onclick="add()"> <i class="layui-icon layui-icon-addition"></i> 新增角色 </button>
        </div>
        <div class="layui-card-body">
            <table class="layui-table">
                <colgroup>
                    <col style="min-width: 100px">
                    <col style="min-width: 300px">
                    <col style="min-width: 200px">
                </colgroup>
                <thead>
                <tr>
                    <th>角色ID</th>
                    <th>角色名称</th>
                    <th>操作</th>
                </tr>
                </thead>
                <tbody>
                <?php foreach ($this->getData[0] as $rows) { ?>
                    <tr>
                        <td><?php echo $rows['role_id']?></td>
                        <td><?php echo $rows['role_name']?></td>
                        <td>
                            <button class="layui-btn layui-btn-sm" onclick="edit(<?php echo $rows['role_id']?>)"><i class="layui-icon layui-icon-edit" title="编辑"></i> 编辑</button>
                            <button class="layui-btn layui-btn-sm" onclick="del(<?php echo $rows['role_id']?>)"><i class="layui-icon layui-icon-delete" title="删除"></i> 删除 </button>
                        </td>
                    </tr>
                <?php } ?>
                </tbody>
            </table>
            <div style="width:100%; ">
                <div class="grace-pager">
                    <a href="<?php echo $this->getData[1]->firstPage;?>">首页</a>
                    <a href="<?php echo $this->getData[1]->prePage;?>">上一页</a>
                    <?php
                    foreach($this->getData[1]->listPage as $k => $v){
                        if($k == $this->getData[1]->currentPage){
                            echo '<a href="'.$v.'" class="grace-current">'.$k.'</a>';
                        }else{
                            echo '<a href="'.$v.'">'.$k.'</a>';
                        }
                    }
                    ?>
                    <a href="<?php echo $this->getData[1]->nextPage;?>">下一页</a>
                    <a href="<?php echo $this->getData[1]->lastPage;?>">尾页</a>
                </div>
            </div>
        </div>
    </div>
</div>
<script>
    layui.use(['table',  'layer','element' ], function () {
        var table = layui.table;
          $ = layui.$;
          layer = layui.layer;
          element = layui.element;
    });
    function add() {
        layer.open({
            content: "<?php echo PG_SROOT;?>role/add/",
            title: "新增角色",
            area: ['50%', '100%'],
            type: 2,
            offset  : 'rb',//右侧抽屉效果
            maxmin: true,
            shadeClose: true
        });
    }
    function edit(id) {
        layer.open({
            content:  "<?php echo PG_SROOT;?>role/edit/" + id,
            title: "编辑角色",
            area: ['50%', '100%'],
            type: 2,
            offset  : 'rb',//右侧抽屉效果
            maxmin: true,
            shadeClose: true
        });
    }

    function del(id) {
        layer.confirm("确定删除角色吗?", {icon: 3, title: '提示'},
            function (index) {// 确定回调
                //关闭窗口
                layer.close(index);
                //后台真实删除
                $.ajax({
                    url:"<?php echo u('role','del')?>"
                    ,dataType:"json"
                    ,type:"post"
                    ,data:{'id':id}
                    ,success:function(res){
                        if(res.status == "ok"){
                            parent.layer.msg(res.data, {icon: 6,time:1000},function () {
                                window.parent.location.reload();
                            });
                        }else{
                            layer.msg(res.data,{icon:7});
                        }
                    }
                });
            }, function (index) {//取消回调
                layer.close(index);
            }
        );
    }

</script>
</body>
</html>